import React, { useState, useRef } from 'react'
import { View, Text, ScrollView, StyleSheet } from 'react-native';
import { Button, Swiper } from '../../components';
import BaseView from '../components/base-view'
import { list } from "./Data"
export default (props: any) => {
  return (
    <ScrollView>
      <View style={{ backgroundColor: '#f2f2f2', flex: 1, width: '100%', height: '100%' }}>
        <BaseView title="基础用法">
          <Swiper>
            {
              list.map((item) => {
                return <View
                  key={item.id}
                  style={StyleSheet.flatten([
                    styles.swiper_item,
                    {
                      // width:layout.width
                    }])}><Text>{item.text}</Text></View>
              })
            }
          </Swiper>
        </BaseView>
      </View>
    </ScrollView>
  )
}

const styles = StyleSheet.create({
  swiper_item: {
    width: "100%",
    height: 300,
  },
  mrb: {
    marginRight: 20,
  },
})